"use client"

import { ChevronRight, Home } from "lucide-react"
import { Button } from "@/components/ui/button"

interface BreadcrumbProps {
  folderId: number
  onNavigate: (id: number) => void
}

export function Breadcrumb({ folderId, onNavigate }: BreadcrumbProps) {
  // TODO: Fetch actual folder path from API
  const path = [{ id: 0, name: "根目录" }]

  return (
    <div className="flex items-center gap-2 mb-6">
      <Button variant="ghost" size="sm" className="gap-2 h-8" onClick={() => onNavigate(0)}>
        <Home className="h-4 w-4" />
        根目录
      </Button>
      {folderId !== 0 && (
        <>
          <ChevronRight className="h-4 w-4 text-muted-foreground" />
          <span className="text-sm text-muted-foreground">当前文件夹</span>
        </>
      )}
    </div>
  )
}
